<template>
	<view class="">
		<view class="list">
			<view class='icon'>
				<u-icon name="clock-fill" color="#2979ff" size="38"></u-icon>
			</view>
			<view class='msg'>历史记录 </view>
			<view>
				<u-icon name="arrow-right" @click="hostUrlFunc" color="#2979ff" size="38"></u-icon>
			</view>
		</view>

		<view class="list">
			<view class='icon'>
				<u-icon name="heart-fill" color="#2979ff" size="38"></u-icon>
			</view>
			<view class='msg'>我的收藏 </view>
			<view>
				<u-icon name="arrow-right" @click="CollectionFunc" color="#2979ff" size="38"></u-icon>
			</view>
		</view>

		<view class="list">
			<view class='icon'>
				<u-icon name="eye" color="#2979ff" size="38"></u-icon>
			</view>
			<view class='msg'>是否开启开发者模式 </view>
			<view>
				<u-switch v-model="checked" @change='Dbugchangesett' size="30"></u-switch>
			</view>
		</view>

		<view class="list" v-show="checked">
			<view class='icon'>
				<u-icon name="setting" color="#2979ff" size="38"></u-icon>
			</view>
			<view class='msg'>我的调试列表 </view>
			<view>
				<u-icon name="arrow-right" color="#2979ff" @click='showlistFunc' size="38"></u-icon>
			</view>
		</view>

		<view class="list">
			<view class='icon'>
				<u-icon name="arrow-upward" color="#2979ff" size="38"></u-icon>
			</view>
			<view class='msg'>是否开启硬件加速 </view>
			<view>
				<u-switch v-model="speedup" @change='speedupChangesett' size="30"></u-switch>
			</view>
		</view>

		<addBugWebsite v-if="showlist" @closepopu='closepopu' :isLeftBnt='isLeftBnt' :title='title' :List="List" ></addBugWebsite>

	</view>
</template>

<script>
	import {
		setState,
		getState
	} from '@/store';
	import addBugWebsite from './components/addBugWebsite.vue';
	export default {
		name: 'Home',
		data() {
			return {
				checked: false,
				showlist: false,
				speedup: false,
				title:'',
				List:[],
				isLeftBnt:false
			}
		},
		components: {
			addBugWebsite
		},
		onLoad() {
			this.speedup = getState('Chromium', 'speedup')
			this.checked = getState('Chromium','isDBUG')
			
		
	
			document.addEventListener("visibilitychange", function() {
				console.log(document.visibilityState);
			});
			
		},
		methods: {
			hostUrlFunc(){
				this.isLeftBnt = false
				this.showlist = true
				this.title = '历史记录';
				let data = getState('Chromium', 'host')
				this.List = data;
				
			},
			// 显示域名调试列表
			showlistFunc() {
				this.showlist = true;
				this.title = '调试列表'
				this.isLeftBnt = true;
				let data = getState('Chromium', 'debugging')
				this.List = data;
			},
			CollectionFunc(){
				this.showlist = true;
				this.title = '我的收藏'
				this.isLeftBnt = true;
				let data = getState('Chromium', 'CollectionList')
				this.List = data;
			},
			// 弹出窗关闭
			closepopu() {
				this.showlist = false
			},
			Dbugchangesett(e) {
				console.log(e);
				this.checked = e
				setState('Chromium', 'isDBUG',e)
			},
			//是否开启硬件加速
			speedupChangesett(e) {
				this.speedup = e
				setState('Chromium', 'speedup',e)
			},

		}
	}
</script>

<style scoped lang="less">
	.list {
		display: flex;
		padding-top: 20rpx;

		.icon {
			width: 10%;
			padding-left: 2%;
		}

		.msg {
			width: 80%;
		}
	}
</style>
